<style lang="scss" src="./index.scss" scoped></style>
<template>
    <page-box class="form">
        <template v-slot:header>
            <ask-breadcrumb>
                <ask-breadcrumb-item name="MenuModuleManage"></ask-breadcrumb-item>
                <ask-breadcrumb-item to="/module-manage/town-home" name="ModuleManageList"></ask-breadcrumb-item>
                <ask-breadcrumb-item name="ModuleManageQuery"></ask-breadcrumb-item>
            </ask-breadcrumb>
            <page-search-column class="tab-column">
                <el-tabs class="theme-gray center" v-model="typeValue" @tab-click="handleTabClick">
                    <el-tab-pane
                        v-for="item in typeList"
                        :label="item.label"
                        :key="item.value"
                        :name="item.value"
                    >
                        <div slot="label" class="el-tab__label">{{item.label}}</div>
                    </el-tab-pane>
                </el-tabs>
            </page-search-column>
        </template>
        <template-form
            v-show="pageIndex === 0"
            ref="templateFormRef"
            :model="model"
            :formType="formType">
            <el-button plain @click="goBack">取消</el-button>
            <el-button
                type="primary"
                @click="changeStep(1)"
                >流程查看</el-button
            >
            <el-button
                plain
                @click="sure('SUBMIT')"
                >发布任务</el-button
            >
        </template-form>
        <flow-form
            v-if="pageIndex === 1"
            ref="flowFormRef"
            :model="model"
            :formType="formType">
            <el-button plain @click="goBack">取消</el-button>
            <el-button
                type="primary"
                @click="changeStep(0)"
                >表单查看</el-button
            >
            <el-button
                @click="sure('SUBMIT')"
                >发布任务</el-button
            >
        </flow-form>
    </page-box>
</template>

<script lang="ts">
import { Component, Mixins } from "vue-property-decorator";
import FormMixin from "./form.mixin";
import TemplateForm from "./src/template-form/index.vue";
import FlowForm from "./src/flow-form/index.vue";
@Component({
    name: "ModuleManageFormNotAlive",
    components: {
        TemplateForm,
        FlowForm
    }
})
export default class ModuleManageForm extends Mixins(FormMixin) {
    typeValue = "template";
    typeList = [
        {
            label: "表单查看",
            value: "template",
            status: "1"
        },
        {
            label: "流程查看",
            value: "flow",
            status: "2"
        }
    ];

    pageIndex = 0;

    async initSearchData() {
        const flowResponse: any = await this.$server["moduleManage/form/flow"](
            {
                data: {
                    formId:
                        this.formType === "add"
                            ? this.model.moduleId
                            : this.model.id
                }
            }
        );
        if (this.responseHasError(flowResponse)) {
            return;
        }
        const flowData = flowResponse.data.data || {};
        const model = {
            flowId: flowData.definitionId || "",
            // 流程名称
            flowName: flowData.name || "",
            // 流程描述
            flowDesc: flowData.description || ""
        };

        this.model = {
            ...this.model,
            ...model
        };
        this.$nextTick(() => {
            // const flowFormRef: any = this.$refs.flowFormRef;
            // flowFormRef && flowFormRef.renderFlow();
            this.resetInterceptRouter();
        });
    }

    changeStep(step: any) {
        // await this.$refs.
        const mapList = {
            0: "template",
            1: "flow"
        };
        this.pageIndex = step;
        this.typeValue = mapList[step] || "";
    }

    handleTabClick() {
        if (this.typeValue === "template") {
            this.changeStep(0);
        } else if (this.typeValue === "flow") {
            this.changeStep(1);
        }
        // this.initSearchData();
        // this.initData();
        // this.batchList = [];
        // this.canReleaseByBatch = false;
        // this.canOfflineByBatch = false;
    }

    async sure(type: any) {
        console.log('发布', type);
        const templateFormRef: any = this.$refs.templateFormRef;
        const templateFormRefValidate: any = await templateFormRef.submit();
        if (templateFormRefValidate.result) {
            this.submit(type);
            return;
        }
        this.$message({
            duration: 3000,
            message: templateFormRefValidate.msg || "请确保表单数据有效！",
            type: "error"
        });
    }

    async submit(type: any) {
        console.log(type);
        const { flowId } = this.model;
        const response = await this.$server["moduleManage/form/startFlow"]({
            data: {
                processId: flowId
                // 开始时间
                // startDay: taskTime[0] || "",
                // 截至日期
                // endDay: taskTime[1] || ""
            }
        });
        if (this.responseHasError(response)) {
            return;
        }
        this.$message({
            message: "任务已发布",
            type: 'success',
            duration: 1500
        });
        this.resetInterceptRouter(() => {
            this.goBack();
        });
    }
}
</script>
